<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <svg>
        <text x="10" y="10">Hello World!</text>
    </svg>


    <svg>
        <text x="10" y="10">
            <tspan font-weight="bold" fill="red">This is bold and red</tspan>
        </text>
    </svg>

    <svg>
        <text x="10" y="10" id="example">This is an example text.</text>

        <text x="20" y="30">
            <tref xlink:href="#example" />
        </text>
    </svg>

    <svg>
        <path id="my_path" d="M 20,20 C 40,40 80,40 100,20" fill="transparent" />
        <text>
            <textPath xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#my_path">
                This text follows a curve.
            </textPath>
        </text>
    </svg>
</body>

</html>